<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>分页展示页面</title>
    <script src="/jquery-3.5.1.js"></script>
</head>
<body>
<div style="width: 800px;margin: auto">
    <form th:action="@{/booksPage}" method="post">
        书名: <input type="text" th:value="${book.name}" name="name">
        <input type="submit" value="查询">
    </form>
    <button onclick="add()">新增</button>
    <table border="1">
        <tr>
            <th>编号</th>
            <th>书名</th>
            <th>价格</th>
            <th>类目</th>
            <th>库存</th>
            <th>图片</th>
            <th>说明</th>
            <th>作者</th>
            <th>已售</th>
            <th>操作</th>
        </tr>
        <tr th:each="book: ${pageInfo.records}">
            <td th:text="${book.id}"></td>
            <td th:text="${book.name}"></td>
            <td th:text="${book.price}"></td>
            <td th:text="${book.category}"></td>
            <td th:text="${book.pnum}"></td>
            <td th:text="${book.imgurl}"></td>
            <td th:text="${book.description}"></td>
            <td th:text="${book.author}"></td>
            <td th:text="${book.sales}"></td>
            <td>
                <a th:href="@{/update(id=${book.getId()})}">
                    修改
                </a>
                <a th:href="@{/del(id=${book.getId()})}">删除</a>
            </td>
        </tr>
    </table>
    <a th:if="${pageInfo.current>1}" th:href="@{/booksPage(pageNum=${pageInfo.current -1})}">上一页</a>
    &nbsp;&nbsp;&nbsp; 总页数: <span th:text="${pageInfo.getPages()}"></span>&nbsp;
    &nbsp;&nbsp;&nbsp; 当前页: <span th:text="${pageInfo.current}"></span>
    &nbsp;&nbsp;&nbsp; 总记录数: <span th:text="${pageInfo.total}"></span>&nbsp;
    &nbsp;&nbsp;&nbsp;<a th:if="${pageInfo.current<pageInfo.getPages()}"
                         th:href="@{/booksPage(pageNum=${pageInfo.current+1})}">下一页</a>
</div>
</body>
</html>
<script>
    function add(){
        window.location.href='/add'
    }
</script>
